﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global.css" />
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global_color.css" />
        <script src="../js/jquery-3.2.1.js"></script>
        <script language="javascript" type="text/javascript">
            $.ajax({
                url: "/selectAllModules",
                type: "post",
                success: function (result) {
                    console.log(result)

                    if (result.indexOf("角色管理") == -1) {
                        document.getElementById("lia1").style.display = "none"
                    }
                    if (result.indexOf("管理员管理") == -1) {
                        document.getElementById("lia2").style.display = "none"
                    }
                    if (result.indexOf("资费管理") == -1) {
                        document.getElementById("lia3").style.display = "none"
                    }
                    if (result.indexOf("账务账号管理") == -1) {
                        document.getElementById("lia4").style.display = "none"
                    }
                    if (result.indexOf("业务账号管理") ==-1) {
                        document.getElementById("lia5").style.display = "none"
                    }
                    if (result.indexOf("账单管理") ==-1) {
                        document.getElementById("lia6").style.display = "none"
                    }
                    if (result.indexOf("报表管理") == -1) {
                        document.getElementById("lia7").style.display = "none"
                    }
                }
            });

            function changeTab(e,ulObj) {                
                var obj = e.srcElement || e.target;
                if (obj.nodeName == "A") {
                    var links = ulObj.getElementsByTagName("a");
                    for (var i = 0; i < links.length; i++) {
                        if (links[i].innerHTML == obj.innerHTML) {
                            links[i].className = "tab_on";
                        }
                        else {
                            links[i].className = "tab_out";
                        }
                    }
                }
            }
        </script>
    </head>
    <body>
        <!--Logo区域开始-->
        <div id="header">
            <img src="../images/logo.png" alt="logo" class="left"/>
            <a href="/logout">[退出]</a>
        </div>
        <!--Logo区域结束-->
        <!--导航区域开始-->
        <div id="navi">                        
            <ul id="menu">
                <li><a href="../index.html" class="index_off"></a></li>
                <li id="lia1"><a href="rolelist" class="role_off"></a></li>
                <li id="lia2"><a href="adminlist" class="admin_off"></a></li>
                <li id="lia3"><a href="fee" class="fee_off"></a></li>
                <li id="lia4"><a href="accountlist" class="account_off"></a></li>
                <li id="lia5"><a href="servicelist" class="service_off"></a></li>
                <li id="lia6"><a href="bill" class="bill_off"></a></li>
                <li id="lia7"><a href="report" class="report_on"></a></li>
                <li><a href="userinfo" class="information_off"></a></li>
                <li><a href="changepsw" class="password_off"></a></li>
            </ul>            
        </div>
        <!--导航区域结束-->
        <!--主要区域开始-->        
        <div id="report_main">
        	<div class="tabs">
    	        <ul onclick="changeTab(event,this);">
        	        <li><a href="#####" class="tab_on" title="每位客户每月的累计时长">客户使用时长</a></li>
                    <li><a href="#####" class="tab_out" title="每台服务器上累计时长最高的前三名客户">时长排行榜</a></li>
                    <li><a href="#####" class="tab_out" title="每台服务器每种资费标准的使用次数">资费使用率</a></li>
                </ul>
            </div>            
            <div class="report_box">
                <!--数据区域：用表格展示数据-->
                <div id="report_data">
                    <table id="datalist">
                        <tr>                            
                            <th>账号 ID</th>
                            <th>账务帐号</th>
                            <th>客户名称</th>
                            <th class="width200">身份证号码</th>
                            <th>电话</th>
                            <th class="width150">月份</th>
                            <th class="width150">累积时长</th>
                        </tr>
                        <tbody id="tbody">

                        </tbody>
                    </table>
                </div>
                <!--分页-->
                <div id="pages">
                </div>

            </div>
        </div>
        <!--主要区域结束-->
        <div id="footer">
            <p>[源自北美的技术，最优秀的师资，最真实的企业环境，最适用的实战项目]</p>
            <p>版权所有(C)云科技有限公司 </p>
        </div>
    </body>
    <script src="../js/jquery-3.2.1.js"></script>
    <script>
        function addNewTR(re) {
            var tr = $("<tr><td>"+re.accountId+"</td><td>"+re.loginName+"</td><td>"+
                        re.realName+"</td><td>"+re.idcardNo+"</td><td>"+re.telephone+"</td><td>"+
                        re.createDate+"</td><td>"+'待计算'+"</td></tr>")
            var tab = $("#tbody");
            tab.append(tr);
        }
//        getAllMessages();
//        function getAllMessages() {
//            $.ajax({
//                url: "/allreport",
//                type: "post",
//                success: function (result) {
//                    for (var i in result) {
//                        var re = result[i];
//                        console.log(re);
//                        addNewTR(re, i);
//                    }
//                }
//            })
//        }

        $.ajax({
            url: "/rpage",
            type: "type",
            success: function (result) {
                var roleList = result.list;
                var pages = result.pages;
                var pageNum = result.pageNum;
                var isFirstPage = result.isFirstPage;
                var isLastPage = result.isLastPage;
                for (var i in roleList) {
                    var role = roleList[i];
                    addNewTR(role);
                }
                $("#pages").append("<a id='up'>上一页</a>")

                for (var i = 1; i < pages+1; i++) {
                    if (i == pageNum) {
                        $("#pages").append("<a id=" + i + "; class='current_page'; onclick='changePage(" + i + ")'>" + i + "</a>")
                    } else {
                        $("#pages").append("<a id=" + i + "; onclick='changePage(" + i + ")'>" + i + "</a>")
                    }
                }
                $("#pages").append("<a id='down'>下一页</a>")
                if (!isFirstPage) {
                    var num = pageNum - 1;
                    $("#up").attr("onclick", "changePage(" + num + ")");
                }
                if (!isLastPage) {
                    var num = pageNum + 1;
                    $("#down").attr("onclick", "changePage(" + num + ")");
                }
            }
        })


        function changePage(pagenum) {

            $.ajax({
                url: "/rpage",
                type: "post",
                data: {
                    pagenum: pagenum,
                },
                success: function (result) {
                    $("#tbody").empty();
                    $("#pages").empty();
                    var roleList = result.list;
                    var pages = result.pages;
                    var pageNum = result.pageNum;
                    var isFirstPage = result.isFirstPage;
                    var isLastPage = result.isLastPage;
                    for (var i in roleList) {
                        var role = roleList[i];
                        addNewTR(role);
                    }
                    $("#pages").append("<a id='up'>上一页</a>")
                    if (!isFirstPage) {
                        var num = pageNum - 1;
                        $("#up").attr("onclick", "changePage(" + num + ")");
                    }
                    for (var i = 1; i < pages+1; i++) {
                        if (i == pageNum) {
                            $("#pages").append("<a id=" + i + "; class='current_page'; onclick='changePage(" + i + ")'>" + i + "</a>")
                        } else {
                            $("#pages").append("<a id=" + i + "; onclick='changePage(" + i + ")'>" + i + "</a>")
                        }
                    }
                    $("#pages").append("<a id='down'>下一页</a>")
                    if (!isLastPage) {
                        var num = pageNum + 1;
                        $("#down").attr("onclick", "changePage(" + num + ")");
                    }
                }
            })
        }

    </script>
</html>
